<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="/jsp/common/common.jsp"%>
<script src="<%=basePath%>/static/js/jquery.ztree.all-3.5.min.js"></script>
<link href="<%=basePath%>/static/css/metroStyle.css" rel="stylesheet" type="text/css">
</head>
<body>

	<div class="documentContent" id="documentContent">
		<div class="top-div">
			<em></em><span>&nbsp;>&nbsp;人员组织架构&nbsp;>&nbsp;群组管理</span>
		</div>
		<div>
			<div class="wf-content-left" style="width: 30%;">
				<div style="margin: 5px;">
					域： <select class="table-input" id="domain" style="width: 30%;">
						<option value="">请选择</option>
					</select>
					<button class="btn-table" id="addGroupTypeButton">新建类型</button>
					<button class="btn-table" id="addGroupButton">新建群组</button>
					<button class="btn-table" id="deleteGroupButton">删除</button>
				</div>
				<ul id="ztreeUl" class="ztree"></ul>
			</div>
			<div class="wf-content-right" style="width: 69%; padding-left: 2px;">
				<div style="height: 180px;">
					<!-- form-box -->
					<div class="form-box">
						<h2 class="form-title">基本信息</h2>
						<div class="form-content">
							<table width="100%" border="0" cellpadding="0" cellspacing="0" class="form-table">
								<tr>
									<td width="15%" class="form-table-tdleft">名称</td>
									<td width="35%"><input class="table-input" name="name" id="name" value="" /></td>
									<td width="15%" class="form-table-tdleft">编号</td>
									<td width="35%"><input class="table-input" name="serialNumber" id="serialNumber" value="" /></td>
								</tr>
								<tr>
									<td class="form-table-tdleft">描述</td>
									<td><input class="table-input" name="description" id="description" value="" /></td>
									<td class="form-table-tdleft">分类</td>
									<td><span id="type"></span></td>
								</tr>
							</table>

							<input type="hidden" name="id" id="id" value="" /> <input type="hidden" name="domainId" id="domainId" value="" />
						</div>
					</div>
					<!-- form-box -->
				</div>
				<div style="height: 20px; padding-left: 20px;">
					<button class="btn-table" id="saveOrgButton">保存机构信息</button>
					<button class="btn-table" id="addEIToGroup" style="display: none;">添加人员</button>
					<button class="btn-table" id="addFormulaToGroup" style="display: none;">添加公式</button>
					<button class="btn-table" id="deleteEI" style="display: none;">删除</button>
					<button class="btn-table" id="deleteFormula" style="display: none;">删除</button>
					<button class="btn-table" id="preview" style="display: none;">预览</button>
				</div>
				<div class="tablelist" style="margin-left: 2px;">
					<div class="tabcon" id="middleCon" style="overflow: auto;"></div>
					<div id="paginationDiv" class="page clearfix"></div>
				</div>
			</div>
		</div>
	</div>

	<script type="text/javascript">

/**
 * 全局变量
 */
var zTreeGobalObjcet;
var tablegridGobalObject;

$(document).ready(function(){
	
	var bodyHt=document.documentElement.clientHeight;
	var tableDivHeight = bodyHt-247;	
	$('#middleCon').height(tableDivHeight-60);
	
	blindButton();
	
	getPageData();
	
});



/**
 * 初始化zTree
 */
function initzTree(domainId){
	
	var zTreeUrl = '<%=basePath%>/biz/ou/group/getGroupListData.do?domainId='+domainId;
	var setting = {
			check: {
				enable: true
			},
			async:{
				enable:true,
				type:'post',
				url: zTreeUrl
			},
    		view: {
    			dblClickExpand: false,
    			showLine: true,
    			selectedMulti: true,
    			showIcon:true
    		},
    		data: {
    			simpleData: {
    				enable:true,
    				idKey: "id",
    				pIdKey: "parentId",
    				rootPId: "-1"
    			}
    		},
    		check: {
    			enable: true,
    			chkStyle: 'radio',
    			radioType:'all'
    		},

    		callback: {
    			onClick: zTreeOnClick,
    			onCheck: zTreeOnCheck,
    			onAsyncSuccess: function(){
    				zTreeGobalObjcet.expandAll(true);
    			}

    		}
    	};
    
	zTreeGobalObjcet = $.fn.zTree.init($('#ztreeUl'), setting, null);
}

function zTreeOnClick(event, treeId, treeNode){
	$.each(treeNode,function(key,value){
		if($('input[id="'+key+'"]')){
			$('input[id="'+key+'"]').val(value);
		}
		
		if($('span[id="'+key+'"]')){
			$('span[id="'+key+'"]').html(value);
		}
	});
	
	//获取群组下的内容
	getGroupContent(treeNode.id,treeNode.type);
}


/**
 * 获取群组下的内容
 *
 * 如果是一个固定人员群组 获取群组下的身份
 * 如果是一个动态计算的群组 获取群组下的所有公式
 *
 */
function getGroupContent(groupId,groupType){
	
	var url = "<%=basePath%>/biz/ou/group/getGroupContent.do?domainId="+$('#domain').val();
	url = url + '&groupId='+groupId;
	url = url + '&groupType='+groupType;
	
	if(groupType === 'F'){
		
	  	$('#addEIToGroup').show();
	  	$('#addFormulaToGroup').hide();
	  	$('#deleteEI').show();
	  	$('#deleteFormula').hide();
	  	$('#preview').hide();
	  	
	  	if(tablegridGobalObject){
	  		tablegridGobalObject.destory();
	  		tablegridGobalObject = null;
	  	}
		
		tablegridGobalObject = $('#middleCon').tablegrid({
			url: url,
			columns:[	
			         	{field:'id',ischeckbox:true,align:'center',width:4},
			   	        {field:'empName',title:'姓名',width:11},
			   	        {field:'empSerialNumber',title:'员工编号',width:11},
			   	     	{field:'accountName',title:'登陆账户名称',width:13},
			   	     	{field:'positionName',title:'职务名称',width:11},
			   	     	{field:'positionLevel',title:'职务级别',width:11},
			   	        {field:'orgName',title:'部门名称',width:15},
			   	        {field:'orgSerialNumber',title:'部门编号',width:11},
			   	     	{field:'orgLevelName',title:'部门级别',width:13}
				    ],
		    isPagination: true,
		    resizeColumns: true,
		    isFristData: true,
		    pageConifg: {
		    	pageId : 'paginationDiv'
		    },
		    tableClass : 'table-form'
		});
	}else if(groupType === 'C'){
		
		$('#addEIToGroup').hide();
	  	$('#addFormulaToGroup').show();
	  	$('#deleteEI').hide();
	  	$('#deleteFormula').show();
	  	$('#preview').show();
	  	
	  	if(tablegridGobalObject){
	  		tablegridGobalObject.destory();
	  		tablegridGobalObject = null;
	  	}
	  	
		tablegridGobalObject = $('#middleCon').tablegrid({
			url: url,
			columns:[	
			         	{field:'id',ischeckbox:true,align:'center',width:4},
			   	        {field:'name',title:'公式名称',width:96}
				    ],
		    isPagination: true,
		    resizeColumns: true,
		    isFristData: true,
		    pageConifg: {
		    	pageId : 'paginationDiv'
		    },
		    tableClass : 'table-form'
		});
		
	}
	
	
}

function zTreeOnCheck(event, treeId, treeNode){

}

function blindButton(){
	
	//域 下拉框
	$('#domain').on('change',function(){
		if($(this).val() != ''){
			initzTree($(this).val());
		}else{
			$.fn.zTree.destroy();
			tablegridGobalObject.destory();
		}
	});
	
	//添加身份到群组
	$('#addEIToGroup').on('click',function(){
		
		if($('#domain').val() === ''){
			showAlert('请选择域');
			$('#domain').focus();
			return;
		}
		
		var url = '<%=basePath%>/biz/ou/group/showAddEIToGroup.do?domainId='+$('#domain').val();
		url = url + '&groupId='+$('#id').val();
		var editPage = new $.layer({
			type:'iframe',
			title: '添加身份',
			width:890,
			height:450,
			content:url,
			buttonArray:[
			   {
				   name: '取消',
				   callback:function(){
					   editPage.close();
				   }
			   },
			   
			   {
				   name: '确定',
				   callback:function(){
					   var iframeObj = editPage.getIFrame();
					   iframeObj[0].contentWindow.onConfrim(editPage,tablegridGobalObject);
				   }
			   }
			]
		});
		
		editPage.show();
		
	});
	
	//从群组中删除身份
	$('#deleteEI').on('click',function(){
		
		var rowdataArray = $('#middleCon').tablegrid('getSelect');
		var jsonData = new Array();
		
		$(rowdataArray).each(function(index,entry){
			jsonData.push(entry.eiId);
		});
		
		var jsonDataStr = JSON.stringify(jsonData);
		var url = '<%=basePath%>/biz/ou/group/deleteEIFromGroup.do?groupId='+$('#id').val();
	
		$.ajax({
			url : url,
			type : 'post',
			dataType : 'json',
			data:{jsonData:jsonDataStr},
			success : function(data, textStatus, jqXHR) {
				showAlert('删除成功',function(){
					tablegridGobalObject.reload();
				});
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
			}
		});
		
	});
	
	//添加公式到群组
	$('#addFormulaToGroup').on('click',function(){
		
		if($('#domain').val() === ''){
			showAlert('请选择域');
			$('#domain').focus();
			return;
		}
		
		var url = '<%=basePath%>/biz/ou/group/showAddFormula.do?domainId='+$('#domain').val();
		url = url + '&groupId='+$('#id').val();
		
		var userLayer = new $.layer({
			type:'iframe',
			title: '添加公式',
			width:670,
			height:470,
			content:url,
			buttonArray:[
			   {
				   name: '取消',
				   callback:function(){
					   userLayer.close();
				   }
			   },
			   
			   {
				   name: '确定',
				   callback:function(){
					   var iframeObj = userLayer.getIFrame();
					   iframeObj[0].contentWindow.onConfrim(userLayer,tablegridGobalObject);
				   }
			   }
			]
		});
		
		userLayer.show();
		
	});
	
	//删除群组中的公式
	$('#deleteFormula').on('click',function(){
		var rowdataArray = $('#middleCon').tablegrid('getSelect');
		var jsonData = new Array();
		
		$(rowdataArray).each(function(index,entry){
			jsonData.push(entry.id);
		});
		
		var jsonDataStr = JSON.stringify(jsonData);
		var url = '<%=basePath%>/biz/ou/group/deleteFormulaFromGroup.do?groupId='+$('#id').val();
	
		$.ajax({
			url : url,
			type : 'post',
			dataType : 'json',
			data:{jsonData:jsonDataStr},
			success : function(data, textStatus, jqXHR) {
				showAlert('删除成功',function(){
					tablegridGobalObject.reload();
				});
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
			}
		});
	});
	
	//预览动态群组中的身份
	$('#preview').on('click',function(){
		
		if($('#domain').val() === ''){
			showAlert('请选择域');
			$('#domain').focus();
			return;
		}
		
		var url = '<%=basePath%>/biz/ou/group/showGroupPreview.do?groupId='+$('#id').val();
		url = url + '&domainId='+$('#domain').val();
		
		var userLayer = new $.layer({
			type:'iframe',
			title: '群组预览',
			width:970,
			height:470,
			content:url,
			buttonArray:[
			   {
				   name: '确定',
				   callback:function(){
					   userLayer.close();
				   }
			   }
			]
		});
		
		userLayer.show();
		
	});
	
	//添加群组类型
	$('#addGroupTypeButton').on('click',function(){
		addGroup('T');
	});
	
	//添加群组
	$('#addGroupButton').on('click',function(){
		addGroup('0');
	});
	
	//删除群组
	$('#deleteGroupButton').on('click',function(){
		var nodes = zTreeGobalObjcet.getCheckedNodes(true);
		
		if(!nodes || nodes.length == 0){
			showAlert('请选择需要需要删除的节点');
			return;
		}
		
		var url = '<%=basePath%>/biz/ou/group/deleteGroup.do?';
		url = url + 'domainId='+$('#domain').val();
		url = url + '&groupId='+nodes[0].id;
		
		$.ajax({  
	        url:url,  
	        type:'post',  
	        dataType:'json',  
	        success:function(data,textStatus,jqXHR){  
	        	zTreeGobalObjcet.reAsyncChildNodes(null, "refresh");
	        },  
	        error:function(XMLHttpRequest,textStatus,errorThrown){  
	        }                     
	    });
	});
	
}
/**************************
 * 
 * 打开添加群组页面
 *
 ****************************/
function addGroup(type){
	if($('#domain').val() === ''){
		showAlert('请选择域');
		$('#domain').focus();
		return;
	}
	
	var nodes = zTreeGobalObjcet.getCheckedNodes(true);
	
	if(!nodes || nodes.length == 0){
		showAlert('请选择需要添加群组类型的父节点');
		return;
	}
	
	var url = '<%=basePath%>/biz/ou/group/showGroupAdd.do?';
	url = url + 'domainId='+$('#domain').val();
	url = url + '&type='+type;
	url = url + '&parentId='+nodes[0].id;
	
	var userLayer = new $.layer({
		type:'iframe',
		title: '添加群组类型',
		width:470,
		height:370,
		content:url,
		buttonArray:[
		   {
			   name: '取消',
			   callback:function(){
				   userLayer.close();
			   }
		   },
		   
		   {
			   name: '确定',
			   callback:function(){
				   var iframeObj = userLayer.getIFrame();
				   iframeObj[0].contentWindow.onConfrim(userLayer,tablegridGobalObject);
			   }
		   }
		]
	});
	
	userLayer.show();
}


function getPageData(){
	
 	var url = '<%=basePath%>/biz/domain/getAllDomain.do';

			$.ajax({
				url : url,
				type : 'post',
				dataType : 'json',
				success : function(data, textStatus, jqXHR) {
					$(data).each(function(index, entry) {
						var optionObj = $('<option></option>').append(entry.name).attr('value', entry.id);
						$('#domain').append(optionObj);
					});

				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
				}
			});

		}
	</script>
</body>
</html>